<template>
  <div>
    <top-search></top-search>
    <Swipe class="main-swipe" :data="swipeData"/>
    <div class="store-item">
      <theme-activities></theme-activities>
    </div>
  </div>
</template>
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';
import TopSearch from '@/components/project/nav/topSearch.vue';
import Swipe from '@/components/project/swipe/index.vue';
import ThemeActivities from '@/components/project/commodity-panel/theme-activities.vue';
import { ISwiper } from '@/modules/index';
@Component({
  components: {
    Swipe,
    TopSearch,
    ThemeActivities,
  },
})
export default class Home extends Vue {
  private swipeData: ISwiper[] = [
    {
      url: 'https://timgsa.baidu.com/timg?' +
           'image&quality=80&size=' +
           'b9999_10000&sec=1548226502168&di=' +
           '66d4089719bf663e64e51671d3a47d6e&imgtype=0' +
           '&src=http%3A%2F%2Fimg.chemcp.com%2F201811%2F1630022018111118401220578.jpg',
      href: 'https://www.baidu.com',
    },
    {
      url: 'https://timgsa.baidu.com/timg?' +
           'image&quality=80&size=' +
           'b9999_10000&sec=1548226502168&di=' +
           '66d4089719bf663e64e51671d3a47d6e&imgtype=0' +
           '&src=http%3A%2F%2Fimg.chemcp.com%2F201811%2F1630022018111118401220578.jpg',
      href: 'https://www.baidu.com',
    },
    {
      url: 'https://timgsa.baidu.com/timg?' +
           'image&quality=80&size=' +
           'b9999_10000&sec=1548226502168&di=' +
           '66d4089719bf663e64e51671d3a47d6e&imgtype=0' +
           '&src=http%3A%2F%2Fimg.chemcp.com%2F201811%2F1630022018111118401220578.jpg',
      href: 'https://www.baidu.com',
    },
    {
      url: 'https://timgsa.baidu.com/timg?' +
           'image&quality=80&size=' +
           'b9999_10000&sec=1548226502168&di=' +
           '66d4089719bf663e64e51671d3a47d6e&imgtype=0' +
           '&src=http%3A%2F%2Fimg.chemcp.com%2F201811%2F1630022018111118401220578.jpg',
      href: 'https://www.baidu.com',
    },
  ];
}
</script>

<style lang="scss" scoped>
.main-swipe {
  width: 100%;
  height: 350px;
}
.store-item {
  margin-bottom: 30px;
}
</style>
